<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script>
			var ar = ["kongzi.jpg", "suzhou.jpg", "lovk.jpg", "suanming.jpg"];
			var index = 0;

			function addImg() {
				let d = document.getElementById("pic");
				pic.innerHTML += "<img src='../img/" + ar[index++] + "'/>";

				index = index % ar.length;
			}

			function showCheck() {
				document.getElementById("aihao").innerHTML = "";
				let n = document.getElementsByName("liking");
				for (var i = 0; i < n.length; i++) {
					if (n[i].checked) {
						document.getElementById("aihao").innerHTML += n[i].value+" ";
					}

				}
			}
		</script>
	</head>
	<body>
		<div>
			<label>爱好</label>
			<input type="checkbox" name="liking" value="sing" />唱歌
			<input type="checkbox" name="liking" value="dancing" />跳舞
			<input type="checkbox" name="liking"  value="study" checked />学习
			<input type="checkbox" name="liking"  value="game" />游戏
		</div>
		<p id="aihao"></p>

		<input type="button" value="点击加图片" onclick="addImg()" />

		<input type="button" value="显示选中的爱好" onclick="showCheck()" />
		<div id="pic"></div>
	</body>
</html>
